<template>
	<view class="global">
		<uni-nav-bar dark :fixed="true" shadow background-color="#007AFF" status-bar
					title="订单详情" leftText="返回" @clickLeft="back"  />
		<view class="box">
			<view class="card">
				<view style="display: flex;align-items: baseline;margin-bottom: 10rpx;">
					<view class=""	style="flex: 1;font-size: 32rpx;">
						{{order.orderNo}}
						<uni-icons type="right" size="16" color="#666"
							style="position: relative;top: 2rpx;"></uni-icons>
					</view>
					
					</navigator>
					<view style="font-size: 24rpx;">
						{{order.status}}
					</view>
				</view>
				<view v-for="item in list" style="display: flex;align-items: center;grid-gap: 20rpx;margin-bottom: 10rpx;"
					>
					<view>
						<image style="display: block;width: 160rpx;height: 160rpx;border-radius: 10rpx;"
							:src="item.goodsImg"></image>
					</view>
					<view style="flex: 1;">{{item.goodsName}}×{{item.num}}</view>
					
				</view>
				<view style="text-align: right;">实付￥<text style="font-size: 36rpx;font-weight: bold;color: red;">{{order.actual}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
		import $H from '../../utils/request.js';
	export default {
		data() {
			return {
				order:{},
				list:[],
			}
		},
		onLoad(e) {
			console.log(e)
			this.getdetail(e)
		},
		methods: {
			getdetail(e){
				$H.post("order/detail?id="+e.id).then(res=>{
					console.log(res);
					this.order=res.data
					this.list=res.list
				})
			},
			back(){
				console.log(123);
	uni.navigateBack()
			}
			
		}
	}
</script>

<style scoped>
	.card{
		padding: 10px;
		box-sizing: border-box;
		width: 100%;
		background: #fff;
	}
.global{
	width: 100%;
	height: 100%;
	background: #e5e5e5;
}
.box{
	width: 100%;
	padding: 10px;
	box-sizing: border-box;
}
</style>
